blob: 7a97f56afa1548249bd552714c73c4581fca84fd (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
|
'use client';
import {
UploadIcon as ShareIcon,
type UploadIconHandle as ShareIconHandle,
} from '@/components/icons/animated/upload';
import { Icons } from '@/components/icons/icons';
import { Button } from '@/components/ui/button';
import { cn } from '@/lib/utils';
import { Comments } from '@fuma-comment/react';
import { redirect } from 'next/navigation';
import { useRef } from 'react';
import { toast } from 'sonner';
import { useCopyToClipboard } from 'usehooks-ts';
export function Share({ url }: { url: string }): React.ReactElement {
const iconRef = useRef<ShareIconHandle>(null);
const [_, copyToClipboard] = useCopyToClipboard();
const onClick = async (): Promise<void> => {
await copyToClipboard(`${window.location.origin}${url}`);
toast.success('Copied to clipboard!', {
icon: <Icons.copied className='size-4' />,
description: 'The post link has been copied to your clipboard.',
});
};
return (
<Button
className={cn('group gap-2')}
variant={'secondary'}
onClick={onClick}
onMouseEnter={() => iconRef.current?.startAnimation?.()}
onMouseLeave={() => iconRef.current?.stopAnimation?.()}
>
<ShareIcon className='size-4 hover:bg-transparent' ref={iconRef} />
Share Post
</Button>
);
}
export function PostComments({
slug,
className,
}: { slug: string; className?: string }) {
return (
<Comments
page={slug}
className={cn('w-full', className)}
auth={{
type: 'api',
signIn: () => {
redirect('/login');
},
}}
/>
);
}
|
